<template>
  <div>
    <el-table ref="table" :data="tableData"
              style="width: 100%"
              @selection-change="handleSelectionchangeS"
              :header-cell-style="{ background: '#EEF1F5'}">
      <el-table-column type="selection"
                       :selectable="selectable"
                       width="55">
      </el-table-column>
      <el-table-column prop="cntrno"
                       label="箱号"
                       width="180">
      </el-table-column>
      <el-table-column prop="cstCopercdName"
                       label="持箱人"
                       width="180">
      </el-table-column>
      <el-table-column prop="internalfgName"
                       label="贸易类型"
                       width="180">
      </el-table-column>
      <el-table-column prop="potLdportName"
                       label="装货港"
                       width="180">
      </el-table-column>
      <el-table-column prop="potUnldportName"
                       label="卸货港"
                       width="180">
      </el-table-column>
      <el-table-column prop="potDstnportName"
                       label="目的港"
                       width="180">
      </el-table-column>
      <el-table-column prop="ctypecd"
                       label="箱型"
                       width="180">
      </el-table-column>
      <el-table-column prop="cszCsizecd"
                       label="尺寸"
                       width="180">
      </el-table-column>
      <el-table-column prop="isocd"
                       label="ISO"
                       width="180">
      </el-table-column>
      <el-table-column prop="sealno"
                       label="铅封号"
                       width="180">
      </el-table-column>
      <el-table-column prop="cweight"
                       label="箱货总重（吨）"
                       width="180">
      </el-table-column>
      <el-table-column prop="shippingTypeName"
                       label="运输方式"
                       width="180">
      </el-table-column>
      <el-table-column prop="dtpDnggcdName"
                       label="危险品类别"
                       width="180">
      </el-table-column>
      <el-table-column prop="unno"
                       label="危险品联合国代码"
                       width="180">
      </el-table-column>
      <el-table-column prop="settmpt"
                       label="温度"
                       width="180">
      </el-table-column>
      <el-table-column prop="tmptunitName"
                       label="温度单位"
                       width="180">
      </el-table-column>
      <el-table-column prop="brkdmgcdName"
                       label="残损代码"
                       width="180">
      </el-table-column>
      <el-table-column prop="osdmgcfgName"
                       label="工原残"
                       width="180">
      </el-table-column>
      <el-table-column prop="attachOperationName"
                       label="附加操作"
                       width="180">
      </el-table-column>
      <el-table-column prop="ovlmtcdName"
                       label="超限标志"
                       width="180">
      </el-table-column>
      <el-table-column prop="preOverLength"
                       label="前超长（米）"
                       width="180">
      </el-table-column>
      <el-table-column prop="postOverLength"
                       label="后超长（米）"
                       width="180">
      </el-table-column>
      <el-table-column prop="rightOverWidth"
                       label="右超宽（米）"
                       width="180">
      </el-table-column>
      <el-table-column prop="leftOverWidth"
                       label="左超宽（米）"
                       width="180">
      </el-table-column>
      <el-table-column prop="overHeight"
                       label="超高（米）"
                       width="180">
      </el-table-column>
      <el-table-column fixed="right"
                       label="操作"
                       width="200">
        <template slot-scope="scope">
          <el-button @click="edit(scope.$index)"
                     v-if="seeFlag"
                     type="text"
                     style="color: #1955CF">查看</el-button>
          <el-button @click="edit(scope.$index)"
                     v-if="!seeFlag"
                     type="text"
                     style="color: #1955CF">编辑</el-button>
          <el-button @click="cancel(scope.$index)"
                     type="text"
                     v-if="!seeFlag"
                     style="color: #1955CF">删除</el-button>
           <el-button @click="goodList(scope.$index)"
                      v-if="goods"
                     type="text"
                     style="color: #1955CF">货列表</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: 'goodTable',
  components: {},
  props:{
    goods:{
      default:false
    },
      seeFlag:{
        default:false,
      }
  },
  data() {
    return {
      tableData: [],
      tableData1: [],
      selection: [],
      tempList:[],
    }
  },
  watch:{
    tableData(){
      //console.log(this.tempList)
      let that = this
      this.tableData.forEach((item,index)=>{
        if(item.tmptunit){
          item.tmptunitName = that.tempList.filter(item1 => item.tmptunit === item1.lowValue)[0].meaning;
        }
      })
      this.$forceUpdate()
      //console.log(this.tableData)
    }
  },
  methods: {
    //温度单位
    tempUnit(){
      this.$api.refCode({
        domain:'TMPT_UNIT'
      }).then(res=>{
        this.tempList = res.data.data
        //console.log(this.tableData)
      })
    },
    selectable(){
      return !this.seeFlag
    },
    goodList(index){
      this.$emit('goodList',this.tableData[index],index)
    },
    myUpdate(){
      this.$forceUpdate()
    },
    handleSelectionchangeS(val) {
      this.selection = val;
      //this.$refs.table.toggleRowSelection(val, true);
    },
    cancel(index){
      this.$confirm('确定要删除货物吗？')
          .then(_ => {
            this.tableData.splice(index,1)
            this.tableData1.splice(index,1)
            this.$refs.table.clearSelection()
            this.selection=[]
            this.$message.success('删除成功！')
          })
          .catch(_ => {});
    },
    edit(index){
      // console.log(999)
      this.$emit('edit',this.tableData[index],this.tableData1[index],index)
    }
  },

  computed: {},

  created() {
    this.tempUnit()
  },
}
</script>
<style lang='less' scoped>
</style>